import { SplashScreen } from '@capacitor/splash-screen';
import { DeviceService } from './deviceInfo.js';
const deviceService = new DeviceService();

window.customElements.define(
  'capacitor-welcome',
  class extends HTMLElement {
    constructor() {
      super();

      SplashScreen.hide();

      const root = this.attachShadow({ mode: 'open' });

      root.innerHTML = `<div>
        <button id="take-photo">获取设备ID</button>
        <div id="device-info">....</div>
      </div>`;
    }

    connectedCallback() {
      const self = this;
      self.shadowRoot.querySelector('#take-photo').addEventListener('click', async function (e) {
        const info = self.shadowRoot.querySelector('#device-info');
        if (!info) {
          return;
        }
        try {
          // 获取设备UUID
          info.textContent = `开始获取设备ID`;
          const uuid = await deviceService.getFullDeviceInfo();
          info.textContent = `设备ID为: ${JSON.stringify(uuid, null, 2)}`;
        } catch (e) {
          console.warn('User cancelled', e);
          info.textContent = `获取设备ID失败`;
        }
      });
    }
  },
);
